<template>
  <div class="travel_details">
    <el-container class="base_details_container">
      <BackTitleView :title="title" />
      <el-main>
        <el-tabs v-model="activeName" type="border-card" class="base_details_tabs" :lazy="false">
          <el-tab-pane :name="0">
            <template #label>
              <el-badge>
                <span>基本信息</span>
              </el-badge>
            </template>
            <div class="content">
              <div class="base_details_title">基本信息</div>
              <div class="base_details_content_second">
                <el-form ref="basicFormRef" :model="basicForm" :disabled="readOnly" :rules="basicRules"
                  label-width="100px" class="base_details_form">
                  <el-form-item label="旅行类型" prop="travelType" required>
                    <el-radio-group v-model="basicForm.travelType">
                      <el-radio label="1042001">普通旅行</el-radio>
                      <el-radio label="1042002">组合旅行</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="产品分类" prop="categoryCode">
                    <el-select v-model="basicForm.categoryCode" placeholder="请选择">
                      <el-option v-for="(item, index) in typeOptions" :key="index" :label="item.label"
                        :value="item.value" />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="产品名称" prop="travelName">
                    <el-input v-model="basicForm.travelName" placeholder="请输入" />
                  </el-form-item>
                  <!-- <el-form-item label="归属基地" prop="shopCode">
                    <el-select v-model="basicForm.shopCode" placeholder="请选择">
                      <el-option v-for="(item, index) in baseOptions" :key="index" :label="item.label"
                        :value="item.value" />
                    </el-select>
                  </el-form-item> -->
                  <el-form-item label="出发地" prop="startArea">
                    <SelectCity :value="basicForm.startArea" @setCityCode="setStartArea"></SelectCity>
                    <span class="input_alert">
                      <el-icon>
                        <Warning />
                      </el-icon>
                      出发地为空时，默认从全国出发
                    </span>
                  </el-form-item>
                  <el-form-item label="目的地" prop="targetArea">
                    <el-select v-model="basicForm.targetArea" placeholder="请选择">
                      <el-option v-for="(item, index) in provinceOptions" :key="index" :label="item.label"
                        :value="item.value" />
                    </el-select>
                    <!-- <SelectCity :value="basicForm.targetArea" @setCityCode="setTargetArea"></SelectCity> -->
                  </el-form-item>
                  <el-form-item label="详细地址">
                    <div>
                      <el-input v-model="basicForm.targetShopCode" placeholder="请输入" />
                      <MapSelectAddress class="selectMap" :position="[basicForm.destLng, basicForm.destLat]"
                        @select="selectAddress" :disabled="readOnly" />
                    </div>
                  </el-form-item>
                  <!-- <el-form-item label="成团人数" prop="tourGroupPeopleNum">
                    <el-input
                      type="number"
                      v-model.number="basicForm.tourGroupPeopleNum"
                      onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')"
                      placeholder="请输入"
                    />
                  </el-form-item> -->
                  <el-form-item label="产品封面" prop="picList">
                    <UploadPicture v-model="basicForm.picList" :limit="10" :imgSize="$.describeImgSize()"
                      :fileSize="$.imgFileSize()" :disabled="readOnly" />
                  </el-form-item>
                  <el-form-item label="产品简介" prop="descList">
                    <UploadPicture v-model="basicForm.descList" :limit="50" :fileSize="$.imgFileSize()"
                      :disabled="readOnly" />
                  </el-form-item>
                  <el-form-item label="产品视频" prop="videoList">
                    <UploadVideo v-model="basicForm.videoList" :limit="1" :fileSize="$.videoFileSize()"
                      :disabled="readOnly" />
                  </el-form-item>
                  <el-form-item label="产品筛选标签">
                    <el-checkbox-group v-model="basicForm.tags">
                      <el-checkbox v-for="(item, index) in labelOptions" :key="index" :label="item.value">{{ item.label }}
                      </el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                  <el-form-item label="参团性质">
                    <el-radio-group v-model="basicForm.joinTypeId">
                      <el-radio v-for="(item, index) in naturesOptions" :key="index" :label="item.value">{{ item.label
                      }}</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="游客信息">
                    <el-radio-group v-model="basicForm.guestRequire">
                      <el-radio v-for="(item, index) in visitorOptions" :key="index" :label="item.value">{{ item.label
                      }}</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="下单截止">
                    出行前
                    <el-input class="closing_input" type="number" v-model.number="basicForm.deadlineTimeDay"
                      onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')" />
                    天的
                    <el-select class="closing_select" v-model="basicForm.deadlineTimeHour" placeholder=" ">
                      <el-option v-for="(n, index) in 24" :key="index" :label="index < 10 ? `0${index}` : index"
                        :value="index < 10 ? `0${index}` : index" />
                    </el-select>
                    时:
                    <el-select class="closing_select" v-model="basicForm.deadlineTimeMinute" placeholder=" ">
                      <el-option v-for="(n, index) in 60" :key="index" :label="index < 10 ? `0${index}` : index"
                        :value="index < 10 ? `0${index}` : index" />
                    </el-select>
                    分前可预订
                  </el-form-item>
                  <!-- <el-form-item label="产品库存">
                    <el-input v-model.number="basicForm.stockNum" type="number" onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="请输入" />
                  </el-form-item> -->
                </el-form>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane :name="1">
            <div id="scrollTop"></div>
            <template #label>
              <el-badge>
                <span>套餐设置</span>
              </el-badge>
            </template>
            <div class="content">
              <div class="base_details_title">套餐设置<b></b></div>
              <div class="base_details_content_second">
                <TravelSetMeal ref="setMealDynamic" :data="setMealData" :readOnly="readOnly" :modify="modifyMode"
                  @programme="sendProgramme" />
              </div>
              <div class="base_details_title">参团设置<b></b></div>
              <div class="base_details_content_second">
                <GroupSetting ref="groupSetting" />
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane :name="2">
            <template #label>
              <el-badge>
                <span>其他设置</span>
              </el-badge>
            </template>
            <div class="content">
              <div class="base_details_title">附加费用</div>
              <div class="base_details_content_second">
                <DynamicParams ref="premiumDynamic" :showDefault="false" :template="premiumTemplate" :data="premiumData"
                  :operation="$.DPMoveOperation(readOnly)" :customAdd="true" @add="openChooseAdditional" addText="添加附加费用">
                  <el-table-column label="费用一级名称" align="center">
                    <template #default="scope">
                      <el-input v-model="scope.row.groupName" placeholder="请输入" :disabled="readOnly" />
                    </template>
                  </el-table-column>
                  <el-table-column label="费用二级名称" align="center">
                    <template #default="scope">
                      <el-input v-model="scope.row.extraName" placeholder="请输入" :disabled="readOnly" />
                    </template>
                  </el-table-column>
                  <el-table-column label="费用金额（元）" align="center">
                    <template #default="scope">
                      <el-input-number v-model.number="scope.row.extraPrice" :min="0" :precision="2" :disabled="readOnly"
                        controls-position="right" />
                    </template>
                  </el-table-column>
                  <el-table-column label="说明图片" align="center">
                    <template #default="scope">
                      <UploadSinglePicture v-model="scope.row.picUrl" :width="100" :disabled="readOnly" />
                    </template>
                  </el-table-column>
                  <el-table-column label="供应商" align="center">
                    <template #default="scope">
                      <el-input v-model="scope.row.supplier" placeholder="请输入" :disabled="readOnly" />
                    </template>
                  </el-table-column>
                </DynamicParams>
              </div>
              <div class="base_details_title">行程安排</div>
              <div class="base_details_content_second">
                <RouteManager ref="routeManager" :data="routeManagerData" :travelProgramme="programme"
                  :readOnly="readOnly" />
              </div>
              <div class="base_details_title">产品亮点</div>
              <div class="base_details_content_second">
                <el-form label-width="100px" class="base_details_form" :disabled="readOnly">
                  <el-form-item label="产品亮点">
                    <el-input v-model="featureInfo" type="textarea" :rows="3" placeholder="请输入" clearable />
                  </el-form-item>
                </el-form>
              </div>
              <div class="base_details_title">交通说明</div>
              <div class="base_details_content_second">
                <el-form label-width="100px" class="base_details_form" :disabled="readOnly">
                  <el-form-item label="交通说明">
                    <el-input v-model="travelWay" type="textarea" :rows="3" placeholder="请输入" clearable />
                  </el-form-item>
                </el-form>
              </div>
              <div class="base_details_title">费用说明</div>
              <div class="base_details_content_second">
                <!-- :rules="expenseDescriptionRules" -->
                <el-form ref="expenseDescriptionFormRef" :model="expenseDescriptionForm" label-width="100px"
                  class="base_details_form" :disabled="readOnly">
                  <el-form-item label="费用包含" prop="expenseContain">
                    <el-input v-model="expenseDescriptionForm.expenseContain" type="textarea" :rows="6" placeholder="请输入"
                      clearable />
                  </el-form-item>
                  <el-form-item label="费用不含" prop="expenseExclude">
                    <el-input v-model="expenseDescriptionForm.expenseExclude" type="textarea" :rows="6" placeholder="请输入"
                      clearable />
                  </el-form-item>
                </el-form>
              </div>
              <div class="base_details_title">退改政策</div>
              <div class="base_details_content_second">
                <el-form label-width="100px" class="base_details_form" :disabled="readOnly">
                  <el-form-item label="退改政策">
                    <el-input v-model="expenseAftersale" type="textarea" :rows="6" placeholder="请输入" clearable />
                  </el-form-item>
                </el-form>
              </div>
              <!-- <b></b> -->
              <div class="base_details_title">须知设置</div>
              <div class="base_details_content_second">
                <DynamicParams ref="noticeDynamic" :template="noticeTemplate" :data="noticeData"
                  :operation="$.DPMoveOperation(readOnly)" addText="添加须知">
                  <el-table-column label="须知内容" align="center">
                    <template #default="scope">
                      <el-input class="m_b_10" v-model="scope.row.title" placeholder="请输入须知标题" clearable
                        :disabled="readOnly" />
                      <el-input v-model="scope.row.intro" :rows="3" type="textarea" placeholder="请输入须知内容" clearable
                        :disabled="readOnly" />
                    </template>
                  </el-table-column>
                </DynamicParams>
              </div>
            </div>
          </el-tab-pane>
        </el-tabs>
      </el-main>
      <el-footer>
        <el-button v-show="activeName == 0" @click="route.go(-1)">取消</el-button>
        <el-button @click="tabChange('last')" v-show="activeName != 0">上一步</el-button>
        <el-button @click="tabChange('next')" v-show="activeName != 2" type="primary">下一步</el-button>
        <el-button v-show="activeName == 2" type="primary" @click="intervalSave(false)" v-if="!readOnly">保存</el-button>
        <el-button v-show="activeName == 2" type="primary" @click="intervalSave(true)"
          v-if="!readOnly">保存并提交审核</el-button>
        <el-button @click="approvalPass" v-show="activeName === 2 && basicForm.flowStatus == '1007002'" type="primary"
          v-if="isApproval">审批通过</el-button>
        <el-button @click="approvalRefusal" v-show="activeName === 2 && basicForm.flowStatus == '1007002'" type="primary"
          v-if="isApproval">审批驳回</el-button>
      </el-footer>
      <ChooseAdditional ref="chooseAdditionalRef" @chooseAdditional="chooseAdditional"></ChooseAdditional>
    </el-container>
  </div>
</template>

<script setup>
import UploadVideo from "@com/upload/UploadVideo.vue"
import BackTitleView from "@com/BackTitleView.vue";
import DynamicParams from "@com/DynamicParams.vue";
import SelectCity from "@com/SelectCity.vue";
import TravelSetMeal from "@com/travel/TravelSetMeal.vue";
import GroupSetting from "@com/travel/groupSetting/TravelPrice.vue";
import RouteManager from "@com/travel/RouteManager.vue";
import MapSelectAddress from "@com/MapSelectAddress.vue";
import ChooseAdditional from "@com/travel/ChooseAdditional.vue";
import { ref, reactive, nextTick, watch } from 'vue';
import useRoute from "@util/router";
import { Warning } from "@element-plus/icons-vue";
import api from "@api/travel";
import travelConfigApi from "@api/travelConfig";
import $ from "@util/base";
import { $box, $msg } from "@/common/ui/msg";
import { set } from "nprogress";

const route = useRoute();
const urlQuery = route.query();
var readOnly = false;
var isApproval = false;
var title = "旅游详情";
var modifyMode = false;
$.handleCRU(urlQuery.type, {
  show: () => {
    readOnly = true;
    title = "旅游详情";
    getData();
  },
  add: () => {
    title = "新增旅游";
  },
  modify: () => {
    modifyMode = true;
    title = "修改旅游";
    getData();
  },
  examine: () => {
    readOnly = true;
    isApproval = true;
    title = "旅游详情";
    getData();
  },
});
const groupSetting = ref(null);
const setMealData = ref([]);
const programme = ref([]);
const typeOptions = ref([]);
// const baseOptions = ref([])
const labelOptions = ref([]);
const naturesOptions = ref([]);
const provinceOptions = ref([]);
const visitorOptions = [
  { value: "1051001", label: '不强制填写' },
  { value: "1051002", label: '至少填写一人' },
  { value: "1051003", label: '全部填写' }
]
const featureInfo = ref();
const travelWay = ref();
const expenseAftersale = ref()

function sendProgramme(val) {
  programme.value = val;
}

getConfig();
function getConfig() {
  travelConfigApi.category((val) => {
    typeOptions.value = val;
  });
  // travelConfigApi.base(val => { baseOptions.value = val })
  travelConfigApi.label((val) => {
    labelOptions.value = val;
  });
  travelConfigApi.natures((val) => {
    naturesOptions.value = val;
  });
  travelConfigApi.province((val) => {
    provinceOptions.value = val;
  });
}

const activeName = ref(0);
watch(() => activeName.value, val => {
  if (val == 1) {
    nextTick(() => {
      document.getElementById("scrollTop").scrollIntoView();
    })
  }
})
function tabChange(type) {
  if (activeName.value == 0) {
    basicFormRef.value.validate((valid, fields) => {
      if (valid) {
        activeName.value = Number(activeName.value) + 1;
        setTimeout(() => {
          document.getElementById("scrollTop").scrollIntoView();
        }, 300);
      } else {
        $msg.error("请完善基本信息");
      }
    });
    return;
  } else if (activeName.value == 1) {
    if (!setMealDynamic.value.chack()) {
      $msg.error("请完善套餐设置");
      return;
    }
    if (!groupSetting.value.chack()) {
      $msg.error("请完善参团设置");
      return;
    }
  }
  if (type == "next") {
    activeName.value = Number(activeName.value) + 1;
  } else {
    activeName.value = Number(activeName.value) - 1;
  }
}

const basicFormRef = ref(null);

const basicForm = ref({
  travelType: "1042001",
  categoryCode: null,
  travelName: null,
  // shopCode: null,
  startArea: null,
  targetArea: null,
  targetShopCode: null,
  destLat: null,
  destLng: null,
  // tourGroupPeopleNum: null,
  picList: [],
  descList: [],
  tags: [],
  joinTypeId: null,
  guestRequire: null,
  flowStatus: null,
  flowCode: null,
  deadlineTimeDay: null,
  deadlineTimeHour: null,
  deadlineTimeMinute: null,
  // stockNum: null
});

function setStartArea(value) {
  basicForm.value.startArea = value;
}

// function setTargetArea(value) {
//   basicForm.value.targetArea = value;
// }

function selectAddress(data) {
  basicForm.value.destLat = data.lat + "";
  basicForm.value.destLng = data.lng + "";
  basicForm.value.targetShopCode = data.address;
}

function setTargetCode(value) {
  basicForm.value.targetShopCode = value;
}

const chooseAdditionalRef = ref(null);
function openChooseAdditional() {
  chooseAdditionalRef.value.show();
}

function chooseAdditional(data) {
  console.log("附加费用选中数据：", data)
  for (const item of data) {
    premiumDynamic.value.addData(item)
  }
}

const expenseDescriptionFormRef = ref(null);
const expenseDescriptionForm = ref({
  expenseContain: null,
  expenseExclude:
    "1、单房差或加床。\r\n2、因交通延阻、罢工、天气、飞机机器故障航班取消或更改时间等不可抗力原因所引致的额外费用。\r\n3、酒店押金、酒店内洗衣、理发、电话、传真、收费电视、饮品、烟酒等个人消费。\r\n4、航空险、火车险、旅游人身意外保险，请自行购买。\r\n5、地面服务费(如出发机场接送服务、行李物品保管费、托运行李超重费等)。\r\n6、自由活动期间的餐食费和交通费\r\n7、因旅游者违约、自身过错、自身疾病导致的人身财产损失而额外支付的费用。\r\n8、因景区价格调整产生的门票差价。景区内耳麦、讲解器等。",
});

const expenseDescriptionRules = {
  expenseContain: [
    {
      required: true,
      message: "请输入费用包含说明",
      trigger: "blur",
    },
  ],
  expenseExclude: [
    {
      required: true,
      message: "请输入费用不含说明",
      trigger: "blur",
    },
  ],
};

const basicRules = {
  categoryCode: [
    {
      required: true,
      message: "请选择商品分类",
      trigger: "change",
    },
  ],
  travelName: [
    {
      required: true,
      message: "请输入商品名称",
      trigger: "blur",
    },
  ],
  // shopCode: [{
  //   required: true,
  //   message: '请选择归属基地',
  //   trigger: 'change',
  // }],
  targetArea: [{
    required: true,
    message: '请选择目的地',
    trigger: 'change',
  }],
  // targetShopCode: [
  //   {
  //     required: true,
  //     message: "请填入目的地",
  //   },
  // ],
  // tourGroupPeopleNum: [
  //   {
  //     required: true,
  //     message: "请输入成团人数",
  //     trigger: "blur",
  //   },
  // ],
  picList: [
    {
      required: true,
      type: "array",
      message: "请上传产品封面",
      trigger: "blur",
    },
  ],
  descList: [
    {
      required: true,
      type: "array",
      message: "请上传产品简介",
      trigger: "blur",
    },
  ],
  // stockNum: [{
  //   required: true,
  //   message: '请输入产品库存',
  //   trigger: 'blur',
  // }]
};

const setMealDynamic = ref(null);
const routeManager = ref(null);
const routeManagerData = ref([]);

const premiumTemplate = {
  extraName: null,
  extraPrice: null,
};
const premiumData = ref([]);
const premiumDynamic = ref(null);

function getPremiumValue() {
  let data = premiumDynamic.value.getValue();
  data.remove((e) => {
    return $.isEmpty(e.groupName) && $.isNull(e.extraName) && $.isNull(e.extraPrice) && $.isNull(e.picUrl);
  });
  if (data.length <= 0) {
    return null;
  } else {
    for (const item of data) {
      if ($.isEmpty(item.groupName)) {
        $msg.error("请输入附加费用一级名称");
        return false;
      }
      if ($.isNull(item.extraName)) {
        $msg.error("请输入附加费用二级名称");
        return false;
      }
      if ($.isNull(item.extraPrice)) {
        $msg.error("请输入附加费用金额");
        return false;
      }
      if ($.isNull(item.picUrl)) {
        $msg.error("请上传说明图片");
        return false;
      }
    }
    return data;
  }
}

const noticeTemplate = {
  title: null,
  intro: null,
};
const noticeData = ref([]);
const noticeDynamic = ref(null);

function getNoticeDynamic() {
  let data = noticeDynamic.value.getValue();
  data.remove((e) => {
    return $.isEmpty(e.title) && $.isNull(e.intro);
  });
  if (data.length <= 0) {
    return null;
  }
  for (const item of data) {
    if ($.isEmpty(item.title)) {
      $msg.error("请输入须知标题");
      return false;
    }
    if ($.isNull(item.intro)) {
      $msg.error("请输入须知内容");
      return false;
    }
  }
  return data;
  // if (data.length <= 0) {
  //   $msg.error("请设置须知")
  //   return false
  // } else {
  //   for (const item of data) {
  //     if ($.isEmpty(item.title)) {
  //       $msg.error("请输入须知标题")
  //       return false
  //     }
  //     if ($.isNull(item.intro)) {
  //       $msg.error("请输入须知内容")
  //       return false
  //     }
  //   }
  //   return data
  // }
}

function setDeadlineTime() {
  if ($.isEmpty(basicForm.value.deadlineTimeDay) && $.isEmpty(basicForm.value.deadlineTimeHour) && $.isEmpty(basicForm.value.deadlineTimeMinute)) {
    basicForm.value.deadlineTime = null
    return true
  } else {
    var time = [0, 0, 0]
    if ($.isNotEmpty(basicForm.value.deadlineTimeDay)) {
      time[0] = parseInt(basicForm.value.deadlineTimeDay)
    }
    if ($.isNotEmpty(basicForm.value.deadlineTimeHour)) {
      time[1] = parseInt(basicForm.value.deadlineTimeHour)
    }
    if ($.isNotEmpty(basicForm.value.deadlineTimeMinute)) {
      time[2] = parseInt(basicForm.value.deadlineTimeMinute)
    }
    basicForm.value.deadlineTime = time
  }
}

var intervalSave = $.interval(save, 2500)

function save(isExamine) {
  basicFormRef.value.validate((valid, fields) => {
    if (valid) {
      setDeadlineTime()
      //校验基本信息
      let paramsData = {
        isPass: isExamine ? 2 : 1, // 是否提交审核 1 不提交 2提交审核
        travelItem: basicForm.value,
        otherItem: {},
      };

      // paramsData.travelItem.tags = paramsData.travelItem.tags.join(",");

      if (!setMealDynamic.value.chack()) {
        $msg.error("请完善套餐设置");
        return;
      }

      // 套餐
      let setMealData = setMealDynamic.value.getValue();
      //参团
      let groupSettingData = groupSetting.value.getValue();
      // 附加费用
      let premiumData = getPremiumValue();
      // 行程安排
      let routeData = routeManager.value.getValue();
      // 须知
      let noticeData = getNoticeDynamic();

      if (
        setMealData != false &&
        groupSettingData != false &&
        premiumData != false &&
        routeData != false &&
        noticeData != false
      ) {
        paramsData.packageItems = setMealData;
        paramsData.travelStockItems = groupSettingData
        paramsData.otherItem.expenseItems = premiumData;
        if ($.isNotEmpty(featureInfo.value)) {
          paramsData.otherItem.featureInfo = featureInfo.value;
        }
        if ($.isNotEmpty(travelWay.value)) {
          paramsData.otherItem.travelWay = travelWay.value;
        }
        if ($.isNotEmpty(expenseAftersale.value)) {
          paramsData.otherItem.expenseAftersale = expenseAftersale.value
        }
        paramsData.otherItem.travelPlanItems = routeData;
        paramsData.otherItem.tipItems = noticeData;

        expenseDescriptionFormRef.value.validate((expenseValid) => {
          if (expenseValid) {
            //校验费用说明
            paramsData.otherItem.expenseDescriptionItem =
              expenseDescriptionForm.value;

            $.handleCRU(urlQuery.type, {
              add: () => {
                api.add(paramsData, () => {
                  $msg.succ("保存成功");
                  route.go(-1);
                });
              },
              modify: () => {
                paramsData.packageItems = roomItemDelHander(setMealData);
                api.update(paramsData, () => {
                  $msg.succ("保存成功");
                  route.go(-1);
                });
              },
            });
          }
        });
      }
    } else {
      $msg.error("请完善基本信息");
    }
  });
}

// 被删除的房型数据还在只是设置flag为0
function roomItemDelHander(packageData) {
  if (oldPackageItems) {
    for (const item of oldPackageItems) {
      if (
        packageData.find((e) => {
          return e.id === item.id;
        }) == null
      ) {
        packageData.push({ id: item.id, flag: 0 });
      }
    }
  }
  console.log(packageData);
  return packageData;
}

var oldPackageItems = null;
function getData() {
  api.details(route.query().code, (val) => {
    basicForm.value = val.travelItem;
    let tagList = [];
    val.travelItem.tags.split(",").forEach(item => {
      tagList.push(parseInt(item))
    });
    basicForm.value.tags = tagList;
    setMealData.value = val.packageItems;
    groupSetting.value.improtData(val.travelStockItems)

    const deadlineTime = val.travelItem.deadlineTime
    if (deadlineTime != null && deadlineTime.length >= 3) {
      basicForm.value.deadlineTimeDay = deadlineTime[0]
      basicForm.value.deadlineTimeHour = deadlineTime[1]
      basicForm.value.deadlineTimeMinute = deadlineTime[2]
    }

    let data = [];
    for (const item of val.packageItems) {
      data.push({ packageName: item.name });
    }
    sendProgramme(data);
    if ($.isNotEmpty(val.otherItem.expenseItems)) {
      premiumData.value = val.otherItem.expenseItems;
    }
    routeManagerData.value = val.otherItem.travelPlanItems;
    if ($.isNotEmpty(val.otherItem.featureInfo)) {
      featureInfo.value = val.otherItem.featureInfo;
    }
    if ($.isNotEmpty(val.otherItem.travelWay)) {
      travelWay.value = val.otherItem.travelWay;
    }
    if ($.isNotEmpty(val.otherItem.expenseAftersale)) {
      expenseAftersale.value = val.otherItem.expenseAftersale
    }
    expenseDescriptionForm.value = val.otherItem.expenseDescriptionItem;
    noticeData.value = val.otherItem.tipItems;

    oldPackageItems = val.packageItems;
  });
}

// 审批通过
function approvalPass() {
  $box.open("通过", "确认该商品审批通过", () => {
    api.approval(basicForm.value.flowCode, "1007004", "", () => {
      $msg.succ("审批成功");
      route.go(-1);
    });
  });
}

// 驳回
function approvalRefusal() {
  $box.input("确认驳回", "驳回原因", null, (val) => {
    api.approval(basicForm.value.flowCode, "1007003", val, () => {
      $msg.succ("驳回成功");
      route.go(-1);
    });
  });
}
</script>

<style scoped>
::v-deep input::-webkit-outer-spin-button,
::v-deep input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
}

::v-deep input[type="number"] {
  -moz-appearance: textfield !important;
}
</style>

<style lang="scss">
.travel_details {
  height: 100%;

  .start_area_input {
    width: 200px !important;
    margin-right: 10px;
  }

  .input_alert {
    display: inline-flex;
    align-items: center;
    color: var(--el-text-color-regular);

    .el-icon {
      margin: 0 5px 0 10px;
    }
  }

  .selectMap {
    margin-top: 20px;
  }

  .closing_input,
  .closing_select .el-input,
  .closing_select .el-select {
    width: 60px !important;
    margin: 0 8px !important;
  }

  .closing_select {
    width: 74px !important;
  }
}
</style>